<!--
 * @Author: weikang
 * @Description:
 * @Date: 2024-01-03 22:15:10
 * @LastEditTime: 2024-02-25 22:24:00
 * @FilePath: \env-manager-pc\src\views\document\device\detail\model\gprs1.vue
-->
<script setup lang="ts">
import { ElMessage } from 'element-plus'
import type { GPRS_CONFIG } from './page'
import { useGprsVersionForm } from './page.helper'
import documentApi from '@/api/modules/document'

const { deviceId } = defineProps({
  deviceId: {
    type: String,
    default: '',
  },
})

const moduleID = 1

const stateLoading = ref(false)
const configLoading = ref(false)

const { versionFormData } = useGprsVersionForm()

function getGprsVersion() {
  stateLoading.value = true
  documentApi
    .DeviceGetGPRSVersion({
      deviceObjID: deviceId,
      moduleID,
    })
    .then((res) => {
      versionFormData.SoftVer = res.SoftVer
      versionFormData.ICCID = res.ICCID
      stateLoading.value = false
    }, () => {
      stateLoading.value = false
    })
  stateLoading.value = true
  documentApi
    .DeviceGetGPRSStatus({
      deviceObjID: deviceId,
      moduleID,
    })
    .then((res) => {
      versionFormData.ConnCurStatus = res.ConnCurStatus
      versionFormData.ConnCurStatusName = res.ConnCurStatusName
      versionFormData.Signal = res.Signal
      versionFormData.ConnLastSuccTime = res.ConnLastSuccTime
      versionFormData.ConnLastFailTime = res.ConnLastFailTime
      versionFormData.IMEI = res.IMEI
      stateLoading.value = false
    }, () => {
      stateLoading.value = false
    })
}

getGprsVersion()

async function callGprsVersion() {
  try {
    stateLoading.value = true
    const resVersion = await documentApi.DeviceCallGPRSVersion({
      deviceObjID: deviceId,
      moduleID,
    })

    versionFormData.SoftVer = resVersion.SoftVer
    versionFormData.ICCID = resVersion.ICCID

    const resStatus = await documentApi.DeviceCallGPRSStatus({
      deviceObjID: deviceId,
      moduleID,
    })

    versionFormData.ConnCurStatus = resStatus.ConnCurStatus
    versionFormData.ConnCurStatusName = resStatus.ConnCurStatusName
    versionFormData.Signal = resStatus.Signal
    versionFormData.ConnLastSuccTime = resStatus.ConnLastSuccTime
    versionFormData.ConnLastFailTime = resStatus.ConnLastFailTime
    versionFormData.IMEI = resStatus.IMEI
    stateLoading.value = false
  }
  catch (err) {
    stateLoading.value = false
  }
}

const configFormData = reactive<GPRS_CONFIG>({
  APN: '',
  UserName: '',
  Pwd: '',
  RePlay: 0,
  ReInterval: 0,
  IsEnable: false,
})

function callConfig() {
  configLoading.value = true
  documentApi
    .DeviceCallCommunicateConfig({
      deviceObjID: deviceId,
      moduleID,
    })
    .then(
      (res) => {
        configFormData.APN = res.APN
        configFormData.UserName = res.UserName
        configFormData.Pwd = res.Pwd
        configFormData.RePlay = res.RePlay
        configFormData.ReInterval = res.ReInterval
        configFormData.IsEnable = res.IsEnable
        configLoading.value = false
      },
      (err) => {
        console.error(err)
        configLoading.value = false
      },
    )
}
function setConfig() {
  configLoading.value = true
  documentApi
    .DeviceSetCommunicateConfig({
      deviceObjID: deviceId,
      moduleID,
      config: configFormData,
    })
    .then(
      () => {
        ElMessage.success('设置成功')
        configLoading.value = false
      },
      (err) => {
        configLoading.value = false
        console.error(err)
      },
    )
}
</script>

<template>
  <div>
    <el-card class="box-card" shadow="never">
      <template #header>
        <div class="card-header">
          <span>状态</span>
          <el-button type="primary" link :loading="stateLoading" @click="callGprsVersion">
            召测
          </el-button>
        </div>
      </template>
      <el-form v-loading="stateLoading" label-width="150px" label-suffix="：">
        <el-row>
          <el-col :span="12">
            <el-form-item label="版本">
              <el-input v-model="versionFormData.SoftVer" />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="IMEI">
              <el-input v-model="versionFormData.IMEI" />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="CCID">
              <el-input v-model="versionFormData.ICCID" />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="拨号状态">
              <el-input v-model="versionFormData.ConnCurStatusName" />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="信号强度">
              <el-input v-model="versionFormData.Signal" />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="最近拨号成功时间">
              <el-input v-model="versionFormData.ConnLastSuccTime" />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="最近拨号失败时间">
              <el-input v-model="versionFormData.ConnLastFailTime" />
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
    </el-card>
    <el-card class="box-card mt-20px" shadow="never">
      <template #header>
        <div class="card-header">
          <span>配置</span>
          <div>
            <el-button type="primary" link :loading="configLoading" @click="callConfig">
              召测
            </el-button>
            <el-button type="warning" link :loading="configLoading" @click="setConfig">
              下发
            </el-button>
          </div>
        </div>
      </template>
      <el-form v-loading="configLoading" :model="configFormData" label-width="150px" label-suffix="：">
        <el-row>
          <el-col :span="12">
            <el-form-item label="用户名">
              <el-input v-model="configFormData.UserName" />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="密码">
              <el-input v-model="configFormData.Pwd" />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="APN">
              <el-input v-model="configFormData.APN" />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="重播次数">
              <el-input-number
                v-model="configFormData.RePlay"
                class="w-full"
                :controls="false"
              />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="重播间隔">
              <el-input-number
                v-model="configFormData.ReInterval"
                class="w-full"
                :controls="false"
              />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="启用标识">
              <el-checkbox v-model="configFormData.IsEnable" label="启用" />
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
    </el-card>
  </div>
</template>

<style lang="scss" scoped>
.card-header {
  --at-apply: flex flex-justify-between;
}
</style>
